<ng-template #defaultRenderList>
  <ul *ngIf="stat.shownCount > 0" class="ant-transfer-list-content">
    <div class="LazyLoad" *ngFor="let item of dataSource">
      <li
        *ngIf="!item.hide"
        (click)="onItemSelect(item)"
        class="ant-transfer-list-content-item"
        [ngClass]="{ 'ant-transfer-list-content-item-disabled': disabled || item.disabled }"
      >
        <label
          nz-checkbox
          [nzChecked]="item.checked"
          (nzCheckedChange)="onItemSelect(item)"
          (click)="$event.stopPropagation()"
          [nzDisabled]="disabled || item.disabled"
        >
          <ng-container *ngIf="!render; else renderContainer">{{ item.title }}</ng-container>
          <ng-template
            #renderContainer
            [ngTemplateOutlet]="render"
            [ngTemplateOutletContext]="{ $implicit: item }"
          ></ng-template>
        </label>
      </li>
    </div>
  </ul>
  <div *ngIf="stat.shownCount === 0" class="ant-transfer-list-body-not-found">
    <nz-embed-empty
      [nzComponentName]="'transfer'"
      [specificContent]="notFoundContent"
    ></nz-embed-empty>
  </div>
</ng-template>
<div class="ant-transfer-list-header">
  <label
    *ngIf="showSelectAll"
    nz-checkbox
    [nzChecked]="stat.checkAll"
    (nzCheckedChange)="onItemSelectAll($event)"
    [nzIndeterminate]="stat.checkHalf"
    [nzDisabled]="stat.shownCount == 0 || disabled"
  >
  </label>
  <span class="ant-transfer-list-header-selected">
    <span
      >{{ (stat.checkCount > 0 ? stat.checkCount + '/' : '') + stat.shownCount }}
      {{ dataSource.length > 1 ? itemsUnit : itemUnit }}</span
    >
    <span *ngIf="titleText" class="ant-transfer-list-header-title">{{ titleText }}</span>
  </span>
</div>
<div
  class="{{
    showSearch
      ? 'ant-transfer-list-body ant-transfer-list-body-with-search'
      : 'ant-transfer-list-body'
  }}"
  [ngClass]="{ 'ant-transfer__nodata': stat.shownCount === 0 }"
>
  <div *ngIf="showSearch" class="ant-transfer-list-body-search-wrapper">
    <div
      nz-transfer-search
      (valueChanged)="handleFilter($event)"
      (valueClear)="handleClear()"
      [placeholder]="searchPlaceholder"
      [disabled]="disabled"
      [value]="filter"
    ></div>
  </div>
  <ng-container *ngIf="renderList; else defaultRenderList">
    <div class="ant-transfer-list-body-customize-wrapper">
      <ng-container
        *ngTemplateOutlet="
          renderList;
          context: {
            $implicit: dataSource,
            direction: direction,
            disabled: disabled,
            onItemSelectAll: onItemSelectAll,
            onItemSelect: onItemSelect,
            stat: stat
          }
        "
      ></ng-container>
    </div>
  </ng-container>
</div>
<div *ngIf="footer" class="ant-transfer-list-footer">
  <ng-template
    [ngTemplateOutlet]="footer"
    [ngTemplateOutletContext]="{ $implicit: direction }"
  ></ng-template>
</div>
